<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" href="css/index.css" />
<script type="text/javascript" src="js/html5shiv.min.js"></script>
</head>
<body>
<!--头部模块-->
<div class="fixed absolute">
	<div class="black"></div>
<!--头部导航条-->
	<header class="Head_title">
		<div class="wrap clearFix">
			<h1 class="logo">
				<a href="#">
					<img src="img/logo.png" />
				</a>
			</h1>
			<ul class="List">
				<li >
					<a class="nav" href="index.html">首页</a>
				</li>
				<li class="drop-menu">
					<p><a class="nav" href="privilege.html">特权与等级</a></p>
					<div class="growup">
						<div class="mask"></div>
						<p class="wrap grade clearFix">
							<a href="privilege.html">成长等级</a>
							<a href="#">全部特权</a>
						</p>
					</div>
				</li>
				<li id="active">
					<a class="nav" href="active.html">最新活动</a>
				</li>
				<li>
					<a class="nav" href="annualFee.html">年费专区</a>
				</li>
				<li>
					<a class="nav" href="paybag.html">付费音乐包</a>
				</li>
			</ul>
			<p class="login">
				您还没有登录，<a href="#">马上登录</a>
			</p>
		</div>
	</header>
</div>
<section class="Head" id="nobel">
	<div class="screen">
		<div class="wrap" id="silder">
			<a href="#"></a>
		</div>
		<a class="page p_left" href="#">
			<span></span>
			<img src="img/pageL.png" />
		</a>
		<a class="page p_right" href="#">
			<span></span>
			<img src="img/pageR.png" />
		</a>
	</div>
</section>
<!--页面主题-->
<main>
	<div class="wrap wrap_nav">
		<nav class="clearFix">
			<div class="race" id="race_active" >
				<a  class="race_title" href="#">全部活动</a>
				<ul class="vocalConcert clearFix">
					<li class="vocalList">
						<a class="view" href="#">
							<img src="img/vocal1.png" />
							<span>开豪华绿钻，赢CF用久道具！</span>
						</a>
						<div class="vocal_hide">
							<a href="#">
								<span class="vocalMask"></span>
								<span class="text">
									<strong>活动简介：</strong>
									<span>开豪华绿钻1个月，抽奖1次，多开多得！CF永久道具、黄金武器等你拿！点此参与&gt;&gt;</span>
								</span>
								<em>活动已结束</em>
							</a>
						</div>
					</li>
					<li class="vocalList">
						<a class="view" href="#">
							<img src="img/vocal2.jpg" />
							<span>杨丞琳演唱会</span>
						</a>
						<div class="vocal_hide">
							<a href="#">
								<span class="vocalMask"></span>
								<span class="text">
									<strong>活动简介：</strong>
									<span>开豪华绿钻1个月，抽奖1次，多开多得！CF永久道具、黄金武器等你拿！点此参与&gt;&gt;</span>
								</span>
								<em>活动已结束</em>
							</a>
						</div>
					</li>
					<li class="vocalList">
						<a class="view" href="#">
							<img src="img/vocal3.jpg" />
							<span>夜店</span>
						</a>
						<div class="vocal_hide">
							<a href="#">
								<span class="vocalMask"></span>
								<span class="text">
									<strong>活动简介：</strong>
									<span>开豪华绿钻1个月，抽奖1次，多开多得！CF永久道具、黄金武器等你拿！点此参与&gt;&gt;</span>
								</span>
								<em>活动已结束</em>
							</a>
						</div>
					</li>
					<li class="vocalList">
						<a class="view" href="#">
							<img src="img/vocal4.jpg" />
							<span>金曲演出会</span>
						</a>
						<div class="vocal_hide">
							<a href="#">
								<span class="vocalMask"></span>
								<span class="text">
									<strong>活动简介：</strong>
									<span>开豪华绿钻1个月，抽奖1次，多开多得！CF永久道具、黄金武器等你拿！点此参与&gt;&gt;</span>
								</span>
								<em>活动已结束</em>
							</a>
						</div>
					</li>
					<li class="vocalList">
						<a class="view" href="#">
							<img src="img/vocal5.jpg" />
							<span>理想音乐节</span>
						</a>
						<div class="vocal_hide">
							<a href="#">
								<span class="vocalMask"></span>
								<span class="text">
									<strong>活动简介：</strong>
									<span>开豪华绿钻1个月，抽奖1次，多开多得！CF永久道具、黄金武器等你拿！点此参与&gt;&gt;</span>
								</span>
								<em>活动已结束</em>
							</a>
						</div>
					</li>
					<li class="vocalList">
						<a class="view" href="#">
							<img src="img/vocal6.jpg" />
							<span>大事发声 李泉与Faye飞专场</span>
						</a>
						<div class="vocal_hide">
							<a href="#">
								<span class="vocalMask"></span>
								<span class="text">
									<strong>活动简介：</strong>
									<span>开豪华绿钻1个月，抽奖1次，多开多得！CF永久道具、黄金武器等你拿！点此参与&gt;&gt;</span>
								</span>
								<em>活动已结束</em>
							</a>
						</div>
					</li>
					<li class="vocalList">
						<a class="view" href="#">
							<img src="img/vocal7.jpg" />
							<span>X玖少年团演唱会直播</span>
						</a>
						<div class="vocal_hide">
							<a href="#">
								<span class="vocalMask"></span>
								<span class="text">
									<strong>活动简介：</strong>
									<span>开豪华绿钻1个月，抽奖1次，多开多得！CF永久道具、黄金武器等你拿！点此参与&gt;&gt;</span>
								</span>
								<em>活动已结束</em>
							</a>
						</div>
					</li>
					<li class="vocalList">
						<a class="view" href="#">
							<img src="img/vocal8.jpg" />
							<span>IDOL来了第2期：郭静、韦礼安</span>
						</a>
						<div class="vocal_hide">
							<a href="#">
								<span class="vocalMask"></span>
								<span class="text">
									<strong>活动简介：</strong>
									<span>开豪华绿钻1个月，抽奖1次，多开多得！CF永久道具、黄金武器等你拿！点此参与&gt;&gt;</span>
								</span>
								<em>活动已结束</em>
							</a>
						</div>
					</li>
					<li class="vocalList">
						<a class="view" href="#">
							<img src="img/vocal9.jpg" />
							<span>邓紫棋长沙演唱会抢票</span>
						</a>
						<div class="vocal_hide">
							<a href="#">
								<span class="vocalMask"></span>
								<span class="text">
									<strong>活动简介：</strong>
									<span>开豪华绿钻1个月，抽奖1次，多开多得！CF永久道具、黄金武器等你拿！点此参与&gt;&gt;</span>
								</span>
								<em>活动已结束</em>
							</a>
						</div>
					</li>
				</ul>
			</div>
			<div class="race">
				<a class="race_title" href="#">生活福利</a>
			</div>
			<div class="race">
				<a class="race_title" href="#">折扣福利</a>
			</div>
			<div class="race">
				<a class="race_title" href="#">游戏活动</a>
			</div>
		</nav>
		<a class="moreActive" href="#">
			<span>更多活动</span>
			<img src="img/more.png" />
		</a>
	</div>
</main>
<!--页面底部-->
<footer class="About" id="about">
	<div class="wrap">
		<p class="service">
			<a href="#">关于腾讯</a>
			<span>|</span>
			<a href="#">About Tencent</a>
			<span>|</span>
			<a href="#">服务条款</a>
			<span>|</span>
			<a href="#">用户服务协议</a>
			<span>|</span>
			<a href="#">广告服务</a>
			<span>|</span>
			<a href="#">腾讯招聘</a>
			<span>|</span>
			<a href="#">客服中心</a>
			<span>|</span>
			<a href="#">网站导航</a>
		</p>
		<p class="Copyright">
			<span>Copyright © 1998 - 2017 Tencent.</span>
			<a href="#">All Rights Reserved.</a>
		</p>
		<p class="culture">
			<span>腾讯公司</span>
			<a href="#">版权所有</a>
			<a href="#"> 腾讯网络文化经营许可证</a>
		</p>
	</div>
</footer>
</body>
</html>
